import React, { useEffect } from 'react';
import { View, Text, StyleSheet, Button } from 'react-native';
import { useGame } from '../contexts/GameContext';
import BluetoothConnector from '../components/BluetoothConnector';

const GameScreen = ({ route }) => {
  const { state, dispatch } = useGame();
  const { faction } = route.params;

  useEffect(() => {
    // Initialize Bluetooth
    BluetoothConnector.scanDevices();
    
    // Set initial resources based on faction
    const initialResources = {
      grain: faction.id === 'ming' ? 100 : 50,
      horses: faction.id === 'mongol' ? 100 : 50,
      gunpowder: faction.id === 'japan' ? 100 : 50,
      dragonVein: 0
    };
    
    dispatch({
      resources: initialResources,
      gamePhase: 'battle'
    });
  }, [faction]);

  const handleEndTurn = () => {
    // TODO: Implement turn logic
    dispatch({
      resources: {
        grain: state.resources.grain + 10,
        horses: state.resources.horses + 5,
        gunpowder: state.resources.gunpowder + 5,
        dragonVein: state.resources.dragonVein + 1
      }
    });
  };

  return (
    <View style={styles.container}>
      <Text style={styles.title}>永乐雄心 - {faction.name}</Text>
      
      <View style={styles.resourceContainer}>
        <Text>漕粮: {state.resources.grain}</Text>
        <Text>战马: {state.resources.horses}</Text>
        <Text>硝石: {state.resources.gunpowder}</Text>
        <Text>龙脉: {state.resources.dragonVein}</Text>
      </View>

      <View style={styles.phaseContainer}>
        <Text>当前阶段: {state.gamePhase}</Text>
        <Button title="结束回合" onPress={handleEndTurn} />
      </View>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 20,
  },
  title: {
    fontSize: 24,
    fontWeight: 'bold',
    marginBottom: 20,
  }
});

export default GameScreen;
